<%@ page language="java" pageEncoding="UTF-8" %>
<%@ include file="/common/taglibs.jsp" %>

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <%@ include file="/common/res.jsp" %>
    <%@ include file="/common/res-select2.jsp" %>
    <%@ include file="/common/res-datatable.jsp" %>
    <title>优惠券管理</title>
</head>
<body>
<%@ include file="/common/head.jsp" %>
<div class="wrap-container">
    <div class="row">
        <div class="col-md-3 col-lg-2">
            <%@ include file="/common/left.jsp" %>
        </div>
        <div class="col-md-9 col-lg-10">
            <div class="cms-common-content">
                <h3>优惠券管理</h3>
                <div class="bltitle-content">
                    <form id="searchForm">
                        <table class="cms-change-table" cellpadding="0" cellspacing="0">
                            <tbody>
                            <tr>
                                <td class="search-label">优惠券号：</td>
                                <td class="search-input">
                                    <input type="text" id="search_couponNo" name="search_couponNo" class="form-control" placeholder="请输入券号">
                                </td>
                                <td class="search-label">优惠券状态：</td>
                                <td class="search-input">
                                    <select  id="search_couponStatus" name="search_couponStatus" class="form-control">
                                        <option value="">请选择状态</option>
                                        <option value="1">待使用</option>
                                        <option value="2">已使用</option>
                                    </select>
                                </td>
                            </tr>
                            <tr>
                                <td class="search-label">批次名称：</td>
                                <td class="search-input">
                                    <select  id="search_batchName" name="search_batchName" class="form-control" size="5" >
                                    </select>
                                </td>
                            </tr>
                            </tbody>
                        </table>
                        <p class="search-actionBtn clearfix">
                            <button type="submit" class="btn btn-primary">查询</button>
                            <button type="reset" class="btn btn-default">重置</button>
                        </p>
                    </form>
                </div> <!--/.bltitle-content-->
            </div><!--/.cms-common-content-->
            <div class="clearfix">
                <button type="button" class="btn btn-primary" id="genCoupon">生成优惠券</button>
                <button type="button" class="btn btn-primary" id="export">导出当前查询</button>
                <table id="user-datatables"
                       class="table table-striped table-bordered table-hover" cellspacing="0" width="100%"></table>
            </div>
        </div>
        <!--/.col-md-12-->
    </div>
    <!--/.row-->
</div>


<script>

    $(function () {

        /////////////select////////////

        flushSelect();

        //jquery datatables
        window.oTable  = $('#user-datatables').DataTable({
            'processing': true,
            'serverSide': true,
            'ajax': {
                "url": P.ctx + '/op/coupon/datatables.json',
                "type": "POST",
                'data': function (d) {
                    return $.extend({}, d, buildParam());
                }
            },
            'columns': [
                {'data': 'batchName', 'title': '批次名称', orderable: true},
                {'data': 'couponNo', 'title': '优惠券号', orderable: true},
                {'data': 'couponPwd', 'title': '优惠券密码', orderable: true},
                {'data': 'couponAmount', 'title': '优惠券金额', orderable: true},
                {'data': 'createTime', 'title': '生成时间', orderable: true},
                {'data': 'couponStatus', 'title': '优惠券状态', orderable: true,
                    render: function(data, type, row){
                        if(data == '1'){
                            return P.render("待使用");
                        }else if(data == '2'){
                            return P.render("已使用");
                        }
                    }
                }
            ],
            'columnDefs': [
                {'defaultContent': '', targets: '_all'}
            ],
            'order': [[4, 'desc']],
            dom: '<"clearfix">rpitip',
            'paginate': true,
            language: {
                sSearch: '<span>搜索:</span> ',
                info: '显示_START_到_END_条,共_TOTAL_条记录',
                infoEmpty: '显示0到0条,共0条记录',
                lengthMenu: '每页_MENU_条',
                processing: '正在处理...',
                emptyTable: '<div class="alert no-margin" style="font-size:12px;padding:5px;">无可用数据</div>',
                zeroRecords: '<div class="alert no-margin" style="font-size:12px;padding:5px;">无记录数据</div>',
                search: '输入搜索',
                paginate: {'first': '首页', 'previous': ' 上一页 ', 'next': ' 下一页 ', 'last': ' 尾页 '}
            }
        });

        //搜索表单
        $('#searchForm').on('submit',function(e){
            e.preventDefault();
            window.refreshParentDataGrid(true);
        });

        //添加
        $('#genCoupon').on('click',function(e){
            e.preventDefault();
            openDialog({}) ;
        });

        //导出
        $('#export').on('click',function(e){
            e.preventDefault();
            var form_=$("<form action='${ctx}/op/coupon/export' method='post'></form>"); //定义一个form表单
            var input1 = $('<input>');
            input1.attr('type', 'hidden');
            input1.attr('name', 'batchName');
            input1.attr('value', $("#search_batchName").val());
            var input2 = $('<input>');
            input2.attr('type', 'hidden');
            input2.attr('name', 'couponNo');
            input2.attr('value', $("#search_couponNo").val());
            var input3 = $('<input>');
            input3.attr('type', 'hidden');
            input3.attr('name', 'couponStatus');
            input3.attr('value', $("#search_couponStatus").val());
            form_.append(input1);
            form_.append(input2)
            form_.append(input3)
            $('body').append(form_); //将表单放置在web中
            form_.submit(); //表单提交
            form_.remove()
        });


        function openDialog(param) {
            var _params = $.extend({}, param);
            bootbox.dialog({
                message: "&nbsp;",
                title: "生成优惠券",
                buttons: {
                    submit: {
                        label: "保存",
                        className: "btn-primary",
                        callback: function () {
                            $('#bootbox-body').find('form[name="inputForm"]').eq(0).submit();
                            return false;
                        }
                    },
                    close: {
                        label: "关闭",
                        className: "btn-default",
                        callback: function () {
                            bootbox.hideAll();
                            return false;
                        }
                    }
                }
            });
            $('#bootbox-body').load2('${ctx}/op/coupon/input', _params)
        }



        //全局函数::刷新表格
        window.refreshParentDataGrid = function (resetPaging) {
        	oTable.ajax.reload( null , resetPaging == true)
        }


        function buildParam() {
            return $.extend($('#searchForm').serializeObject(), {})
        }

    });//Dom ready


    function flushSelect() {
        $("#search_batchName").empty();
        $("#search_batchName").prepend("<option value=''>请选择</option>");
        var param = {}
        $.ajax({
            type: "POST",
            url: "${ctx}/op/coupon/get_batchname_list",
            data:param,
            success: function(resp){
                for(var i=0;i<resp.length;i++){
                    $("#search_batchName").append("<option value='"+resp[i].batchName+"'>"+resp[i].batchName+"</option>");
                }
            }
        });

    }
</script>

</body>
</html>